<template>
  <div class="image-card-content flex column" @click="$router.push({ path: '/home/index?u=' + data.url })" >
      
    
    <div class="image-card-box flex-item"  >
        <van-image :src="data.banner" lazy-load custom-class="custom-card-iamge"  />
    </div>
    <div class="card-title flex column" >
        
        <span class="title" > {{ data.title }} </span>
        <span class="time" >{{ data.time }}</span>
    </div>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
export default {
  props: ['data'],
  computed: {
    ...mapGetters({
      systemInfo: 'home/systemInfo'
    })
  },
  mounted () {
    // console.log(this.data)
  }
}
</script>

<style lang="scss" >
.image-card-content {
    // padding: 0.15rem 0;
    // border-radius: 0.16rem;
    // border: 0.01rem solid #ebedf0;
    background-color: #fff;
    .image-card-box {
        .custom-card-iamge {
            width: 3.28rem;
            height: 4.4rem;
        }
    }
    .card-title {
        font-size: 0.24rem;
        color: #555;
        padding: 0.1rem 0.1rem;
        border: 0.01rem solid #ebedf0;
        border-top: none;
        .time {
            color: #8c8c8c;
            font-size: 0.2rem;
        }
    }
}
.image-card-content + .image-card-content {
    margin-top: 0.2rem;
}
</style>
